<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <title>作业报告</title>
    <style>
        body {
            background-color: #f1f1f1;
        }

        .card {
            background-color: white;
        }

        .row:after {
            content: "";
            display: table;
            clear: both;
        }
    </style>
</head>
<body>
    <div class="row">
        <div class="leftcolumn">
            <div class="card"style="background-image:url(微信图片_20230102101031.jpg);">
                <h2>人员信息</h2>
                <p>制作人员：王琪</p>
                <p>班级：软件工程11班</p>
                <p>学号：0223503</p>
            </div>
            <div class="card"style="background-image:url(微信图片_20230102101026.jpg);">
                <h2>网站介绍</h2>
                <p>主题为一些影视和电视剧介绍推荐。灵感来自于最近和朋友聊天聊到一些看过的小说诸如绿山墙的安妮，小妇人，云边有个小卖部等，
                    于是便有了这个网站，希望能够得到您的认可和喜欢。</p>
                </h1>
            </div>
            <div class="card"style="background-image:url(微信图片_20230102101038.jpg);">
                <h2>网站设计</h2>
                <p>网站的内容板块主要用float和clear将内容分为75%和25%的两部分。</p>
                <p>其他子页面做了侧边栏设计，本想做出一个隐藏侧边栏的设计，能力不够未能做出。学习js但也不是那么熟练，为了避免布局适得其反索性不使用。</p>
            </div>
        </div>
        <div calss="rightcolumn">
            <div class="card"style="background-image:url(微信图片_20230101202359.jpg);">
                <h2>网站内容</h2>
                <p>用到的主要技术为CSS和HTML</p>
                <p>主要内容：三个子页面都分别介绍林黛玉和田晓霞以及简爱的故事。</p>
                <p>本想做出金陵十三钗图片轮播，查找很多资料后因图片压缩之后视觉效果不太好，且因点击链接缓存展示速度过慢而放弃。</p>
            </div>
            <div class="card" style="background-image:url(微信图片_20230101202417.jpg);">
                <h2>最终结果与讨论</h2>
                <p>经过这次学习更加意识到了网页设计人员的不容易，可能只是因为一个小小的效果未达到预期就要在电脑前琢磨很久，消费很多时间，很考验耐力。</p>
                <p>但是网页制作出来，心底会弥漫出很大的成就感，正所谓“关关难过关关过”，继续努力加油吧！</p>
            </div>
        </div>
    </div>
</body>

</html>